<template name="blogAdminEdit">
  <div class="meteor-blog-admin">
    <div class="container meteor-blog-admin-edit">
      <div class="row">
        <div class="col-md-8 col-md-offset-2">
          <h1>
            <strong>
              {{#if post._id}}
                {{BlogLanguage.editPost}}
              {{else}}
                {{BlogLanguage.addPost}}
              {{/if}}
            </strong>
          </h1>

          {{#if subsReady}}
            {{#with post}}
              <form>
                <div class="row form-group">
                  <div class="col-md-9">
                    <label>{{BlogLanguage.title}}</label>
                    <input tabindex="1" type="text" class="form-control" name="title" placeholder="{{BlogLanguage.title}}" value="{{title}}">
                  </div>
                  <div class="col-md-3">
                  <label for="featured-image">{{BlogLanguage.featuredImage}}</label>
                    <input type="file" id="input-featured-image" name="featured-image" class="hidden">
                    <label class="btn btn-info" for="input-featured-image">
                      {{#if featuredImage}}
                        {{featuredImageName}}
                      {{else}}
                        {{BlogLanguage.selectFile}}
                      {{/if}}
                    </label>
                    {{#if featuredImage}}
                      &nbsp;<a href="#" data-action="delete-featured"><i class="fa fa-trash-o"></i></a>
                    {{/if}}
                    <p class="help-block">
                      <div class="checkbox">
                        <label for="background-title">
                          <input type="checkbox" name="background-title" id="background-title" checked="{{#if titleBackground}}checked{{/if}}"> {{BlogLanguage.imageAsBackground}}
                        </label>
                      </div>
                    </p>
                  </div>
                </div>
                <div class="row form-group">
                  <div class="col-md-4">
                    <label>{{BlogLanguage.tags}}</label>
                    <input tabindex="2" type="text" class="form-control" name="tags" placeholder="{{BlogLanguage.enterTag}}" value="{{blogJoinTags tags}}" data-role="tagsinput">
                  </div>
                  <div class="col-md-4">
                    <label>{{BlogLanguage.slug}}</label>
                    <input type="text" class="form-control" name="slug" placeholder="{{BlogLanguage.slug}}" value="{{slug}}">
                  </div>
                  <div class="col-md-4">
                    <label>{{BlogLanguage.metaDescription}}</label>
                    <input type="text" class="form-control" name="description" placeholder="{{BlogLanguage.metaDescription}}" value="{{description}}">
                  </div>
                </div>
                <div class="row form-group">
                  <div class="col-md-12">
                    <label>{{BlogLanguage.body}}</label>
                    <div class="edit-mode">
                      <a href="#" data-action="toggle-visual" class="selected">{{BlogLanguage.showAsVisual}}</a>
                      -
                      <a href="#" data-action="toggle-html">{{BlogLanguage.showAsHtml}}</a>
                    </div>
                    <textarea hidden class="html-editor col-xs-12"></textarea>
                    <div class="editable" tabindex="3"></div>
                    <button type="submit" class="btn btn-default">
                      <i class="fa fa-save"></i> {{BlogLanguage.save}}
                    </button>
                    <a href="{{blogPathFor 'blogAdmin'}}" class="btn btn-default">
                      <i class="fa fa-ban"></i> {{BlogLanguage.cancel}}
                    </a>
                  </div>
                </div>
              </form>
            {{/with}}
          {{else}}
            {{> blogLoading}}
          {{/if}}
        </div>
      </div>
    </div>
  </div>
</template>
